<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<title>404财富管家</title>
<meta name="keywords" content="财富管家" />
<meta name="description" content="财富管家" />
<link rel="shortcut icon" th:href="@{/images/littlelogo.png}">
<link rel="icon" th:href="@{/favicon.ico}" mce_href="/favicon.ico" type="image/x-icon"/>
	<link rel="stylesheet" th:href="@{/css/style.css}"/>
	<link rel="stylesheet" th:href="@{/css/page.css}"/>
	<link th:href="@{/css/iconfont/RjdaoIcon.css}" rel="stylesheet" type="text/css">
<script type="text/javascript" th:src="@{/js/jquery-3.2.1.min.js}"></script>
 <link rel="stylesheet" th:href="@{/css/index4.css}">
	<!-- import CSS -->
	<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
	<!-- import Vue before Element -->
	<script src="https://unpkg.com/vue/dist/vue.js"></script>
	<!-- import JavaScript -->
	<script src="https://unpkg.com/element-ui/lib/index.js"></script>
	<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>

<body style="background-color:#f0f0f0;">

<!----header s---->
<div class="topnav">
	<div class="mainw w">
		<div class="l-txt">欢迎致电：400-1234-123 &nbsp;&nbsp; 服务时间：08:30-17:30（工作日）</div>

		<a th:href="@{/information/xinxi2}" class="dh">帮助中心</a>
		<a th:href="@{/information/xinxi3}" class="dh">新手指引</a>

	</div>
</div>

<header>
	<div class="hmain w">
		<a href="index.html" class="logo"><img th:src="@{/images/logo.png}"></a>
		<a th:href="@{/register}" class="topbut">注册</a>
		<a th:href="@{/login}" class="topbut-cur">登录</a>
		<a th:href="@{/logout}" class="ubut">退出</a>
		<a th:href="@{/userCenter/index}" class="ubut" style="padding:0 15px;">个人中心<span><dl th:if="${session.user!=null}" th:text="${session.user.balance}"></dl></span></a>
		<nav>
			<a th:href="@{/index}" >首页</a>
			<a th:href="@{/invest/list}">我要投资</a>
			<a th:href="@{/borrowCenter/index}" class="cur">我要借贷</a>
			<a th:href="@{/zhongchou/list}">众筹中心</a>
			<a th:href="@{/information/xinxi1}">信息披露</a>
		</nav>
    </div>
</header>
<!----header e---->

<!--body s-->

<div class="invest-banner w">
	<img th:src="@{/images/invest-banner.jpg}">
</div>

<div class="invest-title"><dl></dl><span class="tx">项目借贷流程</span><dl></dl></div>
<div class="invest-list">
	<div class="xm-flow" style="padding-top:30px;">
    	<i class="icon-0944" style="color: red;"></i><i class="icon-0248 arrow" style="color: red;"></i>
        <i class="icon-0949" style="color: red;"></i><i class="icon-0248 arrow" style="color: red;"></i>
        <i class="icon-0381"></i><i class="icon-0248 arrow"></i>
         <i class="icon-0738" ></i>
	</div>
    <div class="xm-flow-txt">
    	<span>申请借贷</span>
        <span>资产评估</span>
        <span>签署合同</span>
        <span>完成借贷</span>
    </div>
    <div id="id1" style="margin-left: 240px;margin-top: 20px;">
	    <template>
		  	<el-form ref="form" :model="form"  label-width="80px">
				<label style="font-size: 20px;">身份图片(上传正反2张)</label>
				<input type="hidden" value="">
				<el-form-item >
					<el-upload name="img1" :before-upload="beforeUpload" :action="UploadUrl1()"
								:limit="2"
							   :auto-upload="false" ref="upload1" list-type="picture-card" :on-change="onChange1" :file-list="fileList1"
							   :on-preview="handlePictureCardPreview" :on-remove="handleRemove">
						<i class="el-icon-plus"></i>
					</el-upload>

					<el-dialog :visible.sync="dialogVisible">
						<img width="100%" :src="dialogImageUrl" alt="">
					</el-dialog>

				</el-form-item>
	  			  <label style="font-size: 20px;">车辆资产证明图(最大限制6张)</label>
	  			 
				  <el-form-item >
						  <el-upload name="img2" :before-upload="beforeUpload" action="http://localhost:9000/cms/upload/car"
									 :limit="6"
						 						 :auto-upload="false"  ref="upload2" list-type="picture-card":on-change="onChange2":file-list="fileList2"
						 					  :on-preview="handlePictureCardPreview" :on-remove="handleRemove">
						 			 <i class="el-icon-plus"></i>
							</el-upload>
							
							<el-dialog :visible.sync="dialogVisible">
						  			<img width="100%" :src="dialogImageUrl" alt="">
							</el-dialog>
				</el-form-item>
				

		        <label style="font-size: 20px;">房屋资产证明图(最大限制6张)</label>
		        <el-form-item >
		       			<el-upload name="img3" :before-upload="beforeUpload" :action="UploadUrl3()"
								   :limit="6"	 :auto-upload="false" ref="upload3" list-type="picture-card" :on-change="onChange3" :file-list="fileList3"
		                       :on-preview="handlePictureCardPreview" :on-remove="handleRemove">
		          			 <i class="el-icon-plus"></i>
		        		</el-upload>
		        		
				        <el-dialog :visible.sync="dialogVisible">
				          	 <img width="100%" :src="dialogImageUrl" alt="">
				        </el-dialog>
		
		        </el-form-item>


				<label style="font-size: 20px;">其他资产证明图(最大限制6张)</label>
				<el-form-item >
					<el-upload name="img4" :before-upload="beforeUpload" :action="UploadUrl4()"
							   :limit="6"   :auto-upload="false" ref="upload4" list-type="picture-card" :on-change="onChange4" :file-list="fileList4"
							   :on-preview="handlePictureCardPreview" :on-remove="handleRemove">
						<i class="el-icon-plus"></i>
					</el-upload>

					<el-dialog :visible.sync="dialogVisible">
						<img width="100%" :src="dialogImageUrl" alt="">
					</el-dialog>

				</el-form-item>
				<el-form-item>
					<a class="liubut"  type="success" @click="submitUpload" style="float: left;" onclick="removeopacity()">上传</a>
					<a class="liubut"  style="opacity: 0.2;margin:60px auto 40px auto;float: left;margin-top: -1px;margin-left: 20px;" href="javascript:return false;" >下一步</a>
				</el-form-item>


		   </el-form>
		</template>
	</div>
</div>
<script type="text/javascript" th:src="@{/js/jquery-3.2.1.min.js}"></script>
<script th:inline="javascript">
    /*<![CDATA[*/
    var contextPath = [[${#request.getContextPath()}]]; //获取当前应用路径
	var credit_id=[[${session.credit_id}]];
    var user=[[${session.user}]];
    if(user==null){
        document.getElementsByClassName("topbut")[0].style.display=""
        document.getElementsByClassName("topbut-cur")[0].style.display=""
        document.getElementsByClassName("ubut")[0].style.display="none"
        document.getElementsByClassName("ubut")[1].style.display="none"
    }else {
        document.getElementsByClassName("ubut")[0].style.display="display"
        document.getElementsByClassName("ubut")[1].style.display="display"
        document.getElementsByClassName("topbut")[0].style.display="none"
        document.getElementsByClassName("topbut-cur")[0].style.display="none"
    }

    /*]]>*/
</script>
<script type="text/javascript">
	function removeopacity(){
		document.getElementsByClassName("liubut")[1].style.opacity="1";
		document.getElementsByClassName("liubut")[1].href="/cms/borrowCenter/from3?credit_id="+credit_id;
	}
</script>
<script>
  new Vue ({
  	el: '#id1',
    data () {
      return {
      	form:{
      		name:''
      	},
          fileList1:[],
          fileList2:[],
          fileList3:[],
          fileList4:[],

        dialogImageUrl: '',
        dialogVisible: false
      };
    },
     methods: {
      handleRemove(file, fileList) {
        console.log(file, fileList);
        
      },
         onChange1(file, fileList){
            this.fileList1=fileList;
            console.log(this.fileList1)
         },
         onChange2(file, fileList){
             this.fileList2=fileList;
             console.log(this.fileList2)
         },
         onChange3(file, fileList){
             this.fileList3=fileList;
             console.log(this.fileList3)
         },
         onChange4(file, fileList){
             this.fileList4=fileList;
             console.log(this.fileList4)
         },
      handlePictureCardPreview(file) {
      	console.log("handlePictureCardPreview")
        this.dialogImageUrl = file.url;
        console.log(file.url);
        this.dialogVisible = true;
      },
         beforeUpload(file){
             console.log(this.form.name)
             var fd = new FormData();
             fd.append('fileList',this.fileList);//传文件
             fd.append('name',this.form.name)
             console.log(fd)
             var config = {	    headers:{'Content-Type':'multipart/form-data'}	};
             //fd.append('srid',this.aqForm.srid);//传其他参数
             /*axios.post('/cms/rating/savePic',fd).then(function(res){
                 alert('成功');
             })*/

             return true;
         },
         submitUpload() {

             this.$refs.upload1.submit();
             this.$refs.upload2.submit();
             this.$refs.upload3.submit();
             this.$refs.upload4.submit();
            /* var fd = new FormData();
             fd.append('fileList',this.fileList);//传文件
             fd.append('name',this.form.name)
             axios.post('/cms/rating/savePic',fd).then(function(res){
                 alert('成功');

         })*/
      },
  UploadUrl1:function(){
      return "http://localhost:9000/cms/upload/idCard";
  },

         UploadUrl3:function(){
             return "http://localhost:9000/cms/upload/home";
         },
         UploadUrl4:function(){
             return "http://localhost:9000/cms/upload/other";
         }




  }
  })

</script>
<!--body e-->


<!---客服代码 S--->
<div class="suspension">
	<div class="suspension-box">
		<a href="#" class="a a-service "><i class="i"></i></a>
		<a href="javascript:;" class="a a-service-phone "><i class="i"></i></a>
		<a href="javascript:;" class="a a-qrcode"><i class="i"></i></a>
		<a href="javascript:;" class="a a-top"><i class="i"></i></a>
		<div class="d d-service">
			<i class="arrow"></i>
			<div class="inner-box">
				<div class="d-service-item clearfix">
					<a href="http://wpa.qq.com/msgrd?v=3&uin={$WEB.qq}&site=qq&menu=yes" class="clearfix"><span class="circle"><i class="i-qq"></i></span><h3>咨询在线客服</h3></a>
				</div>
			</div>
		</div>
		<div class="d d-service-phone">
			<i class="arrow"></i>
			<div class="inner-box">
				<div class="d-service-item clearfix">
					<span class="circle"><i class="i-tel"></i></span>
					<div class="text">
						<p>服务热线</p>
						<p class="red number">400-1234-123</p>
					</div>
				</div>
				<div class="d-service-intro clearfix">
					
				</div>
			</div>
		</div>
		<div class="d d-qrcode">
			<i class="arrow"></i>
			<div class="inner-box">
				<div class="qrcode-img"><img th:src="@{/images/gzh.jpg}" alt=""></div>
				<p>微信服务号</p>
			</div>
		</div>

	</div>
</div>

<!---footer s--->
<footer>
	<div class="fmain w">
    	<div class="fm-top">
        	<div class="left">
            
            	<div class="ilist">
                	<h1>联系我们</h1>
                    <div class="t">客服电话</div>
                    <div class="tel">400-1234-123</div>
                    <div class="t">邮箱：quanminsat@163.com</div>
                </div>

				<div class="ilist">
					<h1>关于我们</h1>
					<a th:href="@{/information/jianjie}">公司简介</a>
					<a th:href="@{/information/gonggao}">最新公告</a>
					<a th:href="@{/information/join_us}">加入我们</a>
				</div>
            </div>
            <div class="right">
            	<div class="ewm" style="margin-left:20px;"><img th:src="@{/images/gzh.jpg}"><span>关注公众号</span></div>
            </div>
        </div>
          <div class="fm-bot" style="text-align: center;">
        	<span>&copy; 2018 &nbsp;全民科技有限公司 &nbsp;京ICP备：123456789号 </span>
        	<br />
            <dl>市场有风险 投资需谨慎</dl>
        </div>
    </div>
</footer>
<!---footer e--->


<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){

	/* ----- 侧边悬浮 ---- */
	$(document).on("mouseenter", ".suspension .a", function(){
		var _this = $(this);
		var s = $(".suspension");
		var isService = _this.hasClass("a-service");
		var isServicePhone = _this.hasClass("a-service-phone");
		var isQrcode = _this.hasClass("a-qrcode");
		if(isService){ s.find(".d-service").show().siblings(".d").hide();}
		if(isServicePhone){ s.find(".d-service-phone").show().siblings(".d").hide();}
		if(isQrcode){ s.find(".d-qrcode").show().siblings(".d").hide();}
	});
	$(document).on("mouseleave", ".suspension, .suspension .a-top", function(){
		$(".suspension").find(".d").hide();
	});
	$(document).on("mouseenter", ".suspension .a-top", function(){
		$(".suspension").find(".d").hide(); 
	});
	$(document).on("click", ".suspension .a-top", function(){
		$("html,body").animate({scrollTop: 0});
	});
	$(window).scroll(function(){
		var st = $(document).scrollTop();
		var $top = $(".suspension .a-top");
		if(st > 400){
			$top.css({display: 'block'});
		}else{
			if ($top.is(":visible")) {
				$top.hide();
			}
		}
	});
	
});	
</script>
<!---客服代码 E--->
</body>
</html>
